<script setup>
    import { ref } from 'vue'

    const nums=ref([11,22,33,44])

    const goodLists=ref([
      {id:1,name:'篮球',price:299},
      {id:2,name:'足球',price:99},
      {id:3,name:'排球',price:199},
    ])

    const obj={
      id:1001,
      name:'bit',
      age:9
    }

</script>

<template>
  <div>
    
      <!--  遍历数字数组  -->
      <li v-for="(item, index) in nums">{{ item }}=>{{ index }}</li>
    
    <!--  遍历对象数组  -->
      <div
      v-for="item in goodLists">
      <p>id={{ item.id }}</p>
      <p>name={{ item.name }}</p>
      <p>price={{ item.price }}</p>
    </div>

    <!--  遍历对象  -->
      <li v-for="(value,key,index) in obj">
        {{ value }}=>{{ key }}=>{{ index }}
      </li>

    <!--  遍历数字  -->
      <li v-for="(item,index) in 5">
        {{item}}=>{{ index }}
      </li>
  </div>
</template>

<style scoped>

</style>